AngularJS SQL

AngularJS ஒரு தரவுத்தளத்திலிருந்து தரவைக் காண்பிப்பதற்கு சிறந்தது.

தரவு JSON வடிவத்தில் உள்ளதா என்பதை உறுதிப்படுத்திக் கொள்ளுங்கள்.

உதவிக்குறிப்பு:

SQL தரவை AngularJS உடன் காண்பிக்க, தரவு JSON வடிவத்தில் இருக்க வேண்டும்.

MySQL இயங்கும் PHP சர்வரிலிருந்து தரவைப் பெறுதல்

AngularJS Example

<div ng-app="myApp" ng-controller="customersCtrl">

<table>
  <tr ng-repeat="x in names">
    <td>{{ x.Name }}</td>
    <td>{{ x.Country }}</td>
  </tr>
</table>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
  $http.get("customers_mysql.php")
  .then(function (response) {$scope.names = response.data.records;});
});
</script>

SQL இயங்கும் ASP.NET சர்வரிலிருந்து தரவைப் பெறுதல்

AngularJS Example

<div ng-app="myApp" ng-controller="customersCtrl">

<table>
  <tr ng-repeat="x in names">
    <td>{{ x.Name }}</td>
    <td>{{ x.Country }}</td>
  </tr>
</table>

</div>

<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
  $http.get("customers_sql.aspx")
  .then(function (response) {$scope.names = response.data.records;});
});
</script>

சர்வர் கோட் எடுத்துக்காட்டுகள்

பின்வரும் பகுதி SQL தரவைப் பெறப் பயன்படுத்தப்படும் சர்வர் குறியீட்டின் பட்டியலாகும்.

தொழில்நுட்பம்	விளக்கம்	வெளியீட்டு வடிவம்
PHP மற்றும் MySQL	MySQL தரவுத்தளத்துடன் PHP பயன்படுத்துதல்	JSON
PHP மற்றும் MS Access	MS Access தரவுத்தளத்துடன் PHP பயன்படுத்துதல்	JSON
ASP.NET, VB மற்றும் MS Access	MS Access தரவுத்தளத்துடன் ASP.NET மற்றும் VB பயன்படுத்துதல்	JSON
ASP.NET, Razor மற்றும் SQL Lite	SQL Lite தரவுத்தளத்துடன் ASP.NET Razor பயன்படுத்துதல்	JSON

குறுக்கு-தள HTTP கோரிக்கைகள்

வேறுபட்ட சர்வரிலிருந்து (கோரிக்கை செய்யும் பக்கத்தைத் தவிர) தரவுக்கான கோரிக்கை, குறுக்கு-தள HTTP கோரிக்கைகள் என்று அழைக்கப்படுகிறது.

குறுக்கு-தள கோரிக்கைகள் வலைத்தளத்தில் பொதுவானவை. பல பக்கங்கள் CSS, படங்கள் மற்றும் ஸ்கிரிப்ட்களை வெவ்வேறு சர்வர்களிலிருந்து ஏற்றுகின்றன.

நவீன உலாவிகளில், பாதுகாப்பு காரணங்களுக்காக ஸ்கிரிப்ட்களிலிருந்து குறுக்கு-தள HTTP கோரிக்கைகள் ஒரே தளத்திற்கு மட்டுப்படுத்தப்பட்டுள்ளன.

பாதுகாப்பு குறிப்பு:

குறுக்கு-தள அணுகலை அனுமதிக்க, எங்கள் PHP எடுத்துக்காட்டுகளில் பின்வரும் வரி சேர்க்கப்பட்டுள்ளது:

header("Access-Control-Allow-Origin: *");

சர்வர் கோட் விவரங்கள்

1. சர்வர் கோட் PHP மற்றும் MySQL

<?php
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=UTF-8");

$conn = new mysqli("myServer", "myUser", "myPassword", "Northwind");

$result = $conn->query("SELECT CompanyName, City, Country FROM Customers");

$outp = "";
while($rs = $result->fetch_array(MYSQLI_ASSOC)) {
  if ($outp != "") {$outp .= ",";}
  $outp .= '{"Name":"'  . $rs["CompanyName"] . '",';
  $outp .= '"City":"'   . $rs["City"]        . '",';
  $outp .= '"Country":"'. $rs["Country"]     . '"}';
}
$outp ='{"records":['.$outp.']}';
$conn->close();

echo($outp);
?>

2. சர்வர் கோட் PHP மற்றும் MS Access

<?php
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=ISO-8859-1");

$conn = new COM("ADODB.Connection");
$conn->open("PROVIDER=Microsoft.Jet.OLEDB.4.0;Data Source=Northwind.mdb");

$rs = $conn->execute("SELECT CompanyName, City, Country FROM Customers");

$outp = "";
while (!$rs->EOF) {
  if ($outp != "") {$outp .= ",";}
  $outp .= '{"Name":"'  . $rs["CompanyName"] . '",';
  $outp .= '"City":"'   . $rs["City"]        . '",';
  $outp .= '"Country":"'. $rs["Country"]     . '"}';
  $rs->MoveNext();
}
$outp ='{"records":['.$outp.']}';

$conn->close();

echo ($outp);
?>

3. சர்வர் கோட் ASP.NET, VB மற்றும் MS Access

<%@ Import Namespace="System.IO"%>
<%@ Import Namespace="System.Data"%>
<%@ Import Namespace="System.Data.OleDb"%>
<%
Response.AppendHeader("Access-Control-Allow-Origin", "*")
Response.AppendHeader("Content-type", "application/json")
Dim conn As OleDbConnection
Dim objAdapter As OleDbDataAdapter
Dim objTable As DataTable
Dim objRow As DataRow
Dim objDataSet As New DataSet()
Dim outp
Dim c
conn = New OledbConnection("Provider=Microsoft.Jet.OLEDB.4.0;data source=Northwind.mdb")
objAdapter = New OledbDataAdapter("SELECT CompanyName, City, Country FROM Customers", conn)
objAdapter.Fill(objDataSet, "myTable")
objTable=objDataSet.Tables("myTable")

outp = ""
c = chr(34)
for each x in objTable.Rows
if outp <> "" then outp = outp & ","
outp = outp & "{" & c & "Name"    & c & ":" & c & x("CompanyName") & c & ","
outp = outp &       c & "City"    & c & ":" & c & x("City")        & c & ","
outp = outp &       c & "Country" & c & ":" & c & x("Country")     & c & "}"
next

outp ="{" & c & "records" & c & ":[" & outp & "]}"
response.write(outp)
conn.close
%>

4. சர்வர் கோட் ASP.NET, Razor C# மற்றும் SQL Lite

@{
Response.AppendHeader("Access-Control-Allow-Origin", "*")
Response.AppendHeader("Content-type", "application/json")
var db = Database.Open("Northwind");
var query = db.Query("SELECT CompanyName, City, Country FROM Customers");
var outp =""
var c = chr(34)
}
@foreach(var row in query){
if (outp != "") {outp = outp + ","}
outp = outp + "{" + c + "Name"    + c + ":" + c + @row.CompanyName + c + ","
outp = outp +       c + "City"    + c + ":" + c + @row.City        + c + ","
outp = outp +       c + "Country" + c + ":" + c + @row.Country     + c + "}"
}
outp ="{" + c + "records" + c + ":[" + outp + "]}"
@outp

பயிற்சிகள் மூலம் கற்றல்

குறுக்கு-தள கோரிக்கைகளை அனுமதிக்க PHP இல் எந்த எழுத்து பயன்படுத்தப்படுகிறது?

header("Access-Control-Allow-Origin: *")

✓ சரி! இந்த எழுத்து அனைத்து டொமைன்களிலிருந்தும் குறுக்கு-தள கோரிக்கைகளை அனுமதிக்கிறது.

allow-cross-site: true

✗ தவறு! இது சரியான PHP சின்டாக்ஸ் அல்ல.

enableCORS()

✗ தவறு! இது PHP இல் நிலையான செயல்பாடு அல்ல.

set_cross_domain_access()

✗ தவறு! இது PHP இல் நிலையான செயல்பாடு அல்ல.

பயிற்சியைத் தொடங்கவும்:

மேலே உள்ள பயிற்சிகளை முயற்சிக்கவும். ஒவ்வொரு விருப்பத்தையும் கிளிக் செய்து சரியான பதிலைச் சரிபார்க்கவும்.

AngularJS உடன் SQL ஐப் பயன்படுத்துவதை மாஸ்டர் செய்ய இந்த கருத்துகள் முக்கியம்.

சிறந்த நடைமுறைகள்

JSON வடிவத்தைப் பயன்படுத்தவும்: AngularJS க்கு SQL தரவை JSON வடிவத்தில் வழங்கவும்.

CORS ஐக் கையாளவும்: குறுக்கு-தள கோரிக்கைகளுக்கு சரியான CORS எழுதுகளைச் சேர்க்கவும்.

பாதுகாப்பைக் கைவிடாதீர்கள்: உற்பத்திச் சூழலில் "Access-Control-Allow-Origin: *" பயன்படுத்துவதைத் தவிர்க்கவும்.

தரவு சுத்திகரிப்பு: SQL கோரிக்கைகளுக்கு முன் பயனர் உள்ளீட்டை எப்போதும் சுத்திகரிக்கவும்.